<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
   <head>
      <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
      <title>
         QuickSee CPU Usage API
      </title>
      <script type="text/javascript" src="http://www.google.com/jsapi"></script>
      <script type="text/javascript">
         google.load('visualization', '1', {packages: ['gauge']});
      </script>
      <script type="text/javascript">

         var query1, visualization1;

         function initialize() {
            visualization1 = new google.visualization.Gauge(document.getElementById('visualization1'));
            query1 = new google.visualization.Query('http://127.0.0.1/python/snmp/cpu_usage.py?host=127.0.0.1', {sendMethod:'scriptInjection'});
            query1.setRefreshable(true);
            query1.setRefreshInterval(2);
            query1.send(drawVisualization1);

         }
	    var options = {
            width: 800, height: 200,
            redFrom: 90, redTo: 100,
            yellowFrom:75, yellowTo: 90,
            minorTicks: 5
        };

         function drawVisualization1(response) {
            if (response.isError()) {
               alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
               return;
            }
            visualization1.draw(response.getDataTable(), options);
         }


         google.setOnLoadCallback(initialize);
      </script>
   </head>
   <body>
      <div>
         <div id="visualization1" style="height: 300px; width: 700px; border: 0px solid; float: left;" />
      </div>
   </body>
</html>
